<template>
	<view>
		<view class="my-userinfo-container">
			<!-- 头像昵称区域 -->
			<view class="top-box">
				<image src="../../static/购.jpg" class="avatar"></image>
				<view class="nickname">优购</view>
				<view class="">Vsesion {{Vsesion}} </view>
			</view>
		</view>
		<view class="aa">
			<u-cell-group>
				<view v-for="(item,index) in account" :key="index" @click="version(index)">
					<u-cell class="set1" :value="item.value" :title="item.titile" isLink></u-cell>
				</view>
			</u-cell-group>
		</view>
		<view class="bb">
			<u-link href="https://uviewui.com/" text="《优购许可使用协议》" @click="click"></u-link>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				Vsesion: '10.2.1',
				account: [{
						value: '',
						titile: '功能介绍'
					},
					{
						value: '当前为最新版',
						titile: '版本更新'
					},
				]
			};
		},
		onLoad() {
			uni.$setNavigationBarColor()
			//获取版本
			let _this = this
			wx.getSystemInfo({
				success(res) {
					_this.Vsesion = res.version || '10.2.1'
				}
			})
		},
		methods: {
			version(index) {
				if (index == 1) {
					uni.$showToast("当前为最新版")
				}else{
					uni.navigateTo({
						url:'/subAbility/introduction/introduction'
					})
				} 

			}
		},
	}
</script>


<style lang="scss">
	.aa {
		margin-top: 20px;
	}

	.bb {
		position: absolute;
		bottom: 50px;
		left: 50%;
		right: 0;
		transform: translateX(-40%);


	}

	.my-userinfo-container {

		// 为整个组件的结构添加浅灰色的背景
		background-color: #f4f4f4;

		.top-box {
			height: 400rpx;
			background-color: white;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			position: relative;



			.avatar {
				display: block;
				width: 180rpx;
				height: 180rpx;
				border-radius: 90rpx;
				border: 4rpx solid white;
				box-shadow: 0 2rpx 10rpx black;
			}

			.nickname {
				color: #db8650;
				font-weight: bold;
				font-size: 32rpx;
				margin-top: 20rpx;
			}
		}
		
	}
</style>